<%--
  Created by IntelliJ IDEA.
  User: lenovo
  Date: 2022/9/29
  Time: 10:30
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>主页</title>
    <link href="${pageContext.request.contextPath}/css/reset.css" type="text/css" rel="stylesheet"/>
    <link href="${pageContext.request.contextPath}/css/pages/index.css" type="text/css" rel="stylesheet"/>
    <link href="${pageContext.request.contextPath}/css/bootstrap.min.css" type="text/css" rel="stylesheet"/>
</head>
<body>
    <div class="all">
        <nav class="navbar navbar-default">
            <div class="container-fluid">
                <!-- Brand and toggle get grouped for better mobile display -->
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="#" style="padding: 5px 15px;">
                        <img alt="Brand" src="">
                    </a>
                </div>

                <!-- Collect the nav links, forms, and other content for toggling -->
                <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                    <form class="navbar-form navbar-left">
                        <div class="form-group">
                            <input type="text" class="form-control" placeholder="Search">
                        </div>
                        <button type="button" class="btn btn-default">Submit</button>
                    </form>
                    <ul class="nav navbar-nav navbar-right" style="width: 100px;height: 50px;display: flex;align-items: center;justify-content: space-between;">
                        <li>
                            <span>${user.username}</span>
                        </li>
                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" style="padding: 0">
                                <img class="media-object" src="${user.avatar}" style="width: 32px;height: 32px;border-radius: 50%;display: inline;" alt="${user.username}">
                                <span class="caret"></span>
                            </a>
                            <ul class="dropdown-menu">
                                <li><a href="#">我的</a></li>
                                <li><a href="#">消息</a></li>
                                <li role="separator" class="divider"></li>
                                <li><a href="${pageContext.request.contextPath}/user?method=logout">退出系统</a></li>
                            </ul>
                        </li>
                    </ul>
                </div>
            </div>
        </nav>
        <ul class="nav nav-pills nav-stacked title">
            <li role="presentation" class="active">
                <a href="${pageContext.request.contextPath}/user?method=userListPage&pageNum=1&pageSize=5">用户管理</a>
            </li>
            <li role="presentation">
                <a href="${pageContext.request.contextPath}/pages/user/userInfo.jsp">个人信息管理</a>
            </li>
        </ul>
        <div class="main">
            <iframe id="main" src="/base.jsp" width="100%" height="100%" style="border: none">

            </iframe>
        </div>
    </div>
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery.min.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/bootstrap.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function (){
            $("#logout").click(function (){
                if (confirm("确认退出系统吗?")) {
                    $.ajax({
                        url: "/user?method=logout",
                        type: "get",
                        xhrFields: {
                            withCredentials: true
                        },
                        success: res => {
                            window.location.href = "/pages/login.jsp";
                        }
                    })
                }
            });
            $(".all>.title>li").click(function (){
                $(this).addClass("active").siblings().removeClass("active");
            })

            $(".all>.title>li>a").click(function (e){
                e.preventDefault()
                $("#main").prop("src", $(this).prop("href"));
            })
        })
    </script>
</body>
</html>
